import * as PIXI from 'pixi.js'
import { watch, Ref } from 'vue'
export default (val: Ref<string>, fontSize: number) => {
  const container = new PIXI.Container()
  watch(val, newValue => {
    container.removeChildren()
    let lenx = 0
    newValue.split('').forEach(char => {
      const text = new PIXI.Text({
        text: char,
        style: {
          fontFamily: 'Arial',
          fontSize,
          fill: 0x000000,
        },
      })
      text.position.set(lenx, 0)
      lenx += text.width
      container.addChild(text)
    })
  })
  return container
}
